<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登陆</title>
    <link rel="stylesheet" href="style.css" type="text/css">
</head>
<body>
    <!-- 网站头部 -->
    <header>
        <figure class="header">
            <img src="学院logo.png" alt="学院Logo" width="60px">
            <figcaption class="figcaption">欢迎来到我的网站</figcaption>
        </figure>
        <!-- 搜索框 -->
        <div>
            <input type="text" placeholder="请输入搜索内容">
            <button>搜索</button>
        </div>
    </header>
    <!-- 导航栏 -->
    <nav>
        <ul>
            <li><a th:href="@{/index}">首页</a></li>
            <li><a href="https://www.gxstnu.edu.cn/" target="_blank">新闻</a></li>
            <li><a href="https://www.gxstnu.edu.cn/col/col14/index.html" target="_blank">联系我们</a></li>
            <li><a href="https://www.gxstnu.edu.cn/col/col2/index.html" target="_blank">关于我们</a></li>
            <li><a th:href="@{/login}">登录</a></li>
            <li><a th:href="@{/register}">注册</a></li>
            <li><a th:href="@{/deleteAccount}">注销账号</a></li>
        </ul>
    </nav>

    <!-- 主要内容容器 -->
    <div class="main">
        <article>
            <section style="display: flex;">
                <p>没有什么能够阻挡<br>
                    你对自由的向往<br>
                    天马行空的生涯<br>
                    你的心了无牵挂</p>
                <figure>
                    <img src="图片1.jpg" alt="我的网站" width="300px">
                    <figcaption>我的网站</figcaption>
                </figure>
            </section>
            <!-- 视频介绍 -->
            <section>
                <video src="苍穹外卖课程导学.mp4" controls width="300px"></video>
            </section>
        </article>
        <!-- 侧边栏,登陆表单 -->
        <aside>
            <form action="login" method="post">
                <div>
                    <label for="username">用户名</label>
                    <input type="text" name="username" id="username" placeholder="请输入用户名">
                </div>
                <div>
                    <label for="password">密码</label>
                    <input type="password" name="password" id="password" placeholder="请输入密码">
                </div>
                <div>
                    <input type="submit" value="登录">
                </div>
            </form>
            <p th:text="${msg}"></p>
            <p><a th:href="@{/forgotPassword}" style="color: blue; text-decoration: underline;">忘记密码？</a></p>

            <audio src="你的世界.mp3" controls></audio>
        </aside>
    </div>
    <!-- 页脚 -->
    <footer>© 2021-2022 京ICP备00000000号</footer>
</body>
</html>